// pages/gailan/gailan.js
var app = getApp();
Page({

  /**
   * 页面的初始数据
   */
  data: {
    swiperCurrent: 0,
    indicatorDots: true,
    autoplay: true,
    interval: 3000,
    duration: 800,
    circular: true,
    imgUrls: [
      'https://p3.pstatp.com/large/43700001e49d85d3ab52',
      'https://p3.pstatp.com/large/39f600038907bf3b9c96',
      'https://p3.pstatp.com/large/31fa0003ed7228adf421'
    ],
    list: [
    {
      id:1,
      title:'丰泽区',
      content:'丰泽区作为泉州的中心城区，现代服务业繁荣发达，先后引进国内外大型知名商贸企业，整合培育丰泽金融街、津淮品牌服饰街等一批专业街市，区域消费购物中心地位凸显。培育10幢纳税超千万元商务楼宇，引进24家知名品牌企业的经营总部和区域中心，启动东海片区滨海总部区建设，总部楼宇经济发展取得较大突破。引进泉州微软技术中心，建成锦绣庄民间艺术园、领SHOW天地文化创艺乐园等文化创意基地。',
      it:'item1',
    },{
      id:2,
      title:'建制改革',
      content:'注重传承培育。实施“党务干部传承培育”计划，通过给青年党员干部交任务、压担子，加强对青年党员干部的培养，激发党员干部活力，确保党建工作后继有人，目前5名支委中新调整充实的3名同志平均年龄在35周岁以下。同时，在推进重点领域改革、开展调查研究、精准扶贫、结对帮扶、业务检查以及参与干部考察、效能督查等重要工作中，经常性抽调青年党员参加，坚持以实践锻炼干部、培养干部，促使青年党员干部迅速成长。近三年来，已先后选派2名青年党员干部参与驻村蹲点。',
      it: 'item2',
    },{
      id:3,
      title:'行政区划',
      content: '福建省下辖地级区划，简称“鲤”，别名鲤城、刺桐城，位于福建省东南沿海，北承福州，南接厦门，东望宝岛台湾，辖四区、三市、五县和泉州经济技术开发区、泉州台商投资区，是福建省确定做大做强的三大中心城市之一，是全国首个东亚文化之都，联合国教科文组织唯一认定的海上丝绸之路起点，是列入国家“一带一路”战略的21世纪海上丝绸之路先行区。',
      it: 'item3',
    }],
    toView: '',
    showAsidStatus: false,
    animation1: null,//侧边弹出动画
    animationData1: null,
    titleName: '目录',//
    itemIsClick:0,//目录中被点击的选项
    
    animation: null,//目录按钮动画
    animationData: null,

  },

  /**
   * 生命周期函数--监听页面加载
   */
  onLoad: function (options) {
    this.btnshow();
  },
  //轮播图的切换事件
  swiperChange: function (e) {
    this.setData({
      swiperCurrent: e.detail.current
    })
  },
  //点击指示点切换
  chuangEvent: function (e) {
    this.setData({
      swiperCurrent: e.currentTarget.id
    })
  },
//锚点
  jumpTo: function (e) {
    // 获取标签元素上自定义的 data-opt 属性的值
    let target = e.currentTarget.dataset.opt;
    var index = e.currentTarget.dataset.index;
    console.log('target',target);
    this.setData({
      toView: target,
      itemIsClick:index
    })
  },
  //目录按钮动画隐藏
  btnHide:function(){
    var animation = wx.createAnimation({
      duration: 600,
      timingFunction: "linear",
      delay: 0
    })
    this.animation = animation
    animation.translateX(-300).step()
    this.setData({
      animationData: animation.export(),
    })
    setTimeout(function () {
      animation.translateX(0).step()
      this.setData({
        animationData: animation.export(),
      })
    }.bind(this), 200)
   
  },
  //显示侧边栏
  showAsid: function () {
    // 显示遮罩层
    var animation1 = wx.createAnimation({
      duration: 200,
      timingFunction: "linear",
      delay: 0
    })
    this.animation1 = animation1;
    animation1.translateX(-300).step()
    this.setData({
      animationData1: animation1.export(),
      showAsidStatus: true
    })
    setTimeout(function () {
      animation1.translateX(0).step()
      this.setData({
        animationData1: animation1.export()
      })
    }.bind(this), 200)
    //隐藏按钮
    this.btnHide();
  },
  hideAsid: function () {
    // 隐藏遮罩层
    var animation1 = wx.createAnimation({
      duration: 200,
      timingFunction: "linear",
      delay: 0
    })
    this.animation1 = animation1
    animation1.translateX(-300).step()
    this.setData({
      animationData1: animation1.export(),
    })
    setTimeout(function () {
      animation1.translateX(0).step()
      this.setData({
        animationData1: animation1.export(),
        showAsidStatus: false
      })
    }.bind(this), 200)

    //显示按钮
    this.btnshow();

  },

  btnshow : function(){
    var animation = wx.createAnimation({
      duration: 1000,
      timingFunction: "linear",
      delay: 0
    })
    this.animation = animation;
    animation.translateX(-300).step()
    this.setData({
      animationData: animation.export()
    })
    setTimeout(function () {
      animation.translateX(0).step()
      this.setData({
        animationData: animation.export()
      })
    }.bind(this), 200)
  },
  /**
   * 生命周期函数--监听页面初次渲染完成
   */
  onReady: function () {
  
  },

  /**
   * 生命周期函数--监听页面显示
   */
  onShow: function () {
  
  },

  /**
   * 生命周期函数--监听页面隐藏
   */
  onHide: function () {
  
  },

  /**
   * 生命周期函数--监听页面卸载
   */
  onUnload: function () {
  
  },

  /**
   * 页面相关事件处理函数--监听用户下拉动作
   */
  onPullDownRefresh: function () {
  
  },

  /**
   * 页面上拉触底事件的处理函数
   */
  onReachBottom: function () {
  
  },

  /**
   * 用户点击右上角分享
   */
  onShareAppMessage: function () {
  
  }
  
})